<template>
  <div class="video-main">
    <div class="cam">
        <img v-if="ipaddr" class="img" :src="ipaddr" alt="">
        <p v-else class="home-content-shebei">
            加载中...
        </p>            
    </div>
  </div>
</template>

<script>
export default {
  name: 'Video',
  props: {
    ipaddr:String
  },
  data() {
    return {
      show:true,
    }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.video-main{
  margin: 0 20px;
  display: flex;
  justify-content: center;
  align-items: center;  
}
.cam {
  /* margin: 20px; */
  padding: 10px 10px;
  border-radius: 20px 20px 20px 20px;
  box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.3);
  background-color: rgba(255, 255, 255, 0.9);
  background-attachment: fixed;
  display: flex;
  justify-content: center;
  align-items: center;  
  width: 85vw;
  height: 60vw;
}
.img {
  border-radius: 20px 20px 20px 20px;
  width: 100%;
  height: 100%;
}
</style>
